<template>
	<view class="app">
		<view class="">
			<view class="" v-for="(item, index) in 8" :key="index" @tap="seeDec(item)">
				<view class="">
					<view class=""><image src="https://gnzxwylz.xlygrcw.com/upload/GNZX/home/1.png" mode=""></image></view>
					<view class="">
						<text>留言朱</text>
						<text>1988年2月4日</text>
						<text>科局：政研办公室</text>
					</view>
				</view>
				<view class="">
					<view class="">
						<text>排名:</text>
						<text>2</text>
					</view>
					<text>票数：2589</text>
					<text>投票</text>
				</view>
			</view>
		</view>
		<view class="">
			<view class="loading-text">{{ loadingText }}</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			page: 1,
			pageSize: 10,
			loadingText: '到底了......'
		};
	},
	components: {},
	onLoad() {},
	onReachBottom: function() {
		this.page++;
		console.log(this.page);
	},
	methods: {
		seeDec(data) {
			uni.navigateTo({
				url: '../../motion/motionDec?id=' + data.id
			});
		}
	}
};
</script>

<style lang="scss">
.app {
	padding: 0 50upx;
	border-top: 1px solid #eee;
	> view {
		&:nth-child(1) {
			> view {
				border-bottom: 1px solid #eee;
				padding-top: 20upx;
				&:last-child{
					border-bottom: 0;
				}
				> view {
					&:nth-child(1) {
						display: flex;
						align-items: center;
						view {
							&:nth-child(1) {
								image {
									width: 102upx;
									height: 102upx;
									border-radius: 50%;
								}
							}
							&:nth-child(2) {
								flex: 1;
								margin-left: 40upx;
								text {
									display: block;
									&:nth-child(1) {
										font-size: 32upx;
										font-family: PingFang SC;
										font-weight: bold;
										color: #333333;
										line-height: 60upx;
									}
									&:nth-child(2) {
										padding: 10upx 0;
										font-size: 24upx;
										font-family: PingFang SC;
										font-weight: 400;
										color: #999999;
									}
									&:nth-child(3) {
										font-size: 24upx;
										font-family: PingFang SC;
										font-weight: 400;
										color: #c8000b;
									}
								}
							}
						}
					}
					&:nth-child(2) {
						display: flex;
							padding: 40upx 0 40upx 140upx;
						view{
							margin-right: 20upx;
							padding: 0 20upx;
							height: 46upx;
							line-height: 46upx;
							background: #FFFFFF;
							border: 1px solid #DCDCDC;
							border-radius: 5px;
							text{
								font-size: 26upx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #858888;
								&:nth-child(2){
									color: #EC020E;
									margin-left: 5upx;
								}
							}
						}
						>text{
							display: block;
							&:nth-of-type(1){
								font-size: 26upx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #858888;
								margin-right: 20upx;
								padding: 0 20upx;
								height: 46upx;
								line-height: 46upx;
								background: #FFFFFF;
								border: 1px solid #DCDCDC;
								border-radius: 5px;
							}
							&:nth-of-type(2){
								width: 133upx;
								text-align: center;
								line-height: 46upx;
								border: 1px solid #EC020E;
								height: 46upx;
								background: #FFFFFF;
								border-radius: 5px;
								font-size: 26upx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #EC020E;
								padding: 0 20upx;
							}
						}
					}
				}
			}
		}
	}
	.app-fiexd {
		position: fixed;
		top: 500upx;
		right: 50upx;
		image {
			width: 160upx;
		}
	}
}
</style>
